<template>
  <div class="sortAction row h-full ">
    <a-row class="m-b-md" v-if="businessItemMapList.length > 0" >
      <a-col :span="3" class="text-align-right">
        <label class="m-r-lg">事项名称</label>
      </a-col>
      <a-col :span="8">
        <a-select
          class="w-full"
          :allowClear="true"
          placeholder="请选择事项">
          <a-select-option
            v-for="item in this.businessItemMapList"
            @click="handClick(item)"
            :key="item.id"
            :value="item.id">{{ item.item_name }}</a-select-option>
        </a-select>
      </a-col>
      <a-col :span="3" class="text-align-right">
        <label class="m-r-lg">事项编码</label>
      </a-col>
      <a-col :span="8">
        <a-input
          :disabled="true"
          :value="this.selectedBusinessItem.item_code"/>

      </a-col>
    </a-row>
    <a-table
      :columns="materialColumn"
      :rowKey="(record) => record.id"
      :data-source="InvestmentList"
      bordered >
      <template slot="customSortID" slot-scope="text, record">
        <editable-cell :text="text" @change="onCellChange(record.id, 'customSortID', $event)" />
      </template>
    </a-table>
  </div>

</template>

<script>
import businessService from '@/api/businessService'
import dapProjectService from '@/api/dapProjectService'
import { getColumns } from '@/api/tableColumns'
import EditableCell from '@v/investmentOnline/investmentPlatform/EditableCell.vue'
export default {
  data () {
    return {
      InvestmentList: [],
      businessItemMapList: [],
      selectedBusinessItem: {},
      sortIndex: Number
    }
  },
  methods: {
    // 编辑排序
    async onCellChange (key, dataIndex, value) {
      console.log(key, dataIndex, value)
      await dapProjectService.updateMaterialIndex({
        id: key,
        customSortId: value
      }).then((d) => {
        console.log(d)
      })
      this.InvestmentList = []
      await this.getInvestmentMaterialByItemCode(this.selectedBusinessItem.item_code)
    },

    getColumns,
    // 根据itemCode获取事项材料列表
    async getInvestmentMaterialByItemCode (itemCode) {
      /**
       * true为新数据
       * false为旧数据
       */
      let result = []
      if (this.dataMode) {
        await businessService.getInvestmentMaterialByItemCodeSource(itemCode, 'investment_three_new').then((d) => {
          result = d
        })
      } else {
        await businessService.getInvestmentMaterialByItemCodeSource(itemCode, 'investment_three_old').then((d) => {
          result = d
        })
      }
      console.log(result)
      this.InvestmentList = result
    },
    getBusinessItemMapList () {
      const param = {
        source: this.dataMode ? 'investment_three_new' : 'investment_three_old'
      }
      dapProjectService.getBusinessItemMapList(param).then((d) => {
        console.log('获取业务事项列表--------》', d)
        this.businessItemMapList = d
      })
    },
    handClick (item) {
      this.InvestmentList = []
      this.selectedBusinessItem = item
      this.getInvestmentMaterialByItemCode(this.selectedBusinessItem.item_code)
    }
  },
  mounted () {
    this.getBusinessItemMapList()
  },
  computed: {
    dapProjectService () {
      return dapProjectService
    },
    // 环节标识
    dataMode: {
      get () {
        return this.$store.getters.getDataMode
      },
      set () {}
    },
    materialColumn: {
      get () {
        return getColumns('materialColumn')
      },
      set () {}
    }
  },
  components: {
    EditableCell
  }
}
</script>

<style scoped lang="less">

</style>
